<!-- 用能质量 -->
<template>
  <div class="qualityEnergy">
    <!-- ==========日期=========== -->
    <div class="operate card">
      <div>
        <el-date-picker style="width:180px" v-model="s_time" :editable="false" :clearable="false" :type="d_type" :format="v_type" :value-format="v_type" :picker-options="pickerOptions" placeholder="选择日期时间"></el-date-picker>
      </div>
      <div class="hidden-xs-only">
        <i class="el-icon-minus"></i>
      </div>
      <div>
        <el-tooltip content="查询时间跨度最大为24小时" placement="top">
          <el-date-picker style="width:180px" v-model="e_time" :editable="false" :clearable="false" :type="d_type" :format="v_type" :value-format="v_type" :picker-options="pickerOptions" placeholder="选择日期时间"></el-date-picker>
        </el-tooltip>
      </div>
      <!-- <div>选择车间</div> -->
      <div>
        <el-select v-model="value_time" style="width:150px" placeholder @change="clicklistOne">
          <el-option v-for="item in options_time" :key="item.id" :label="item.name" :value="item.id"></el-option>
        </el-select>
      </div>
      <!-- <div>生产线</div> -->
      <div>
        <el-select v-model="value_time2" style="width:150px" placeholder @change="clicklistTwo">
          <el-option v-for="item in options_time2" :key="item.meterId" :label="item.meterName" :value="item.meterId"></el-option>
        </el-select>
      </div>
      <div>
        <el-button type="primary" :disabled="!value_time2" @click="t_button">查询</el-button>
      </div>
      <div class='export'>
        <el-button type="" v-if="imgurl.length" @click="imgurl_click">接线图</el-button>
        <div v-if="imgurl.length" v-show="false" v-viewer="{movable: true}" class="images">
          <img v-for="src in imgurl" :src="src" :key="src">
        </div>
        	<!-- <viewer :images="imgurl" v-if="imgurl.length" class="images">
	   <img v-for="src in imgurl" :src="src" :key="src" width="0">
	</viewer> -->
      </div>
    </div>
    <el-row class="card ectop">
      <el-col v-loading="scroll_data[0].loading">
        <Mtitle title="功率变化曲线">
          <el-popover placement="right-start" width trigger="click" @show="show(1,'')" @hide="hide(1,'')">
            <el-badge slot="reference" style="color:#007ef4" :value="postfind1_data.num" :max="99" :hidden="postfind1_data.num===0">
              <i class="iconfont icon-msg" style="font-size:20px;"></i>
            </el-badge>
            <span v-if="postfind1_data.num===0">
              <i style="padding-right: 14px;color: #FF9200;font-size: 16px;" class="iconfont icon-xiaolian1"></i>当前时间区间内参数正常
            </span>
            <tb v-else tableTitle="tb_006" :tableData="postfind1_data.tableData" v-loading="false"></tb>
          </el-popover>
        </Mtitle>
        <ecline v-no-data="scroll_data[0].no_data" width="100%" height="400px" unit="kW" :ecdata="postfind1_data.ec_data"></ecline>
      </el-col>
    </el-row>
    <el-row class="card ectop">
      <el-col v-loading="scroll_data[1].loading">
        <Mtitle title="功率因数变化曲线">
          <el-popover placement="right-start" width trigger="click" @show="show(2,'05')" @hide="hide(2,'05')">
            <el-badge slot="reference" style="color:#007ef4" :value="postfind2_data.num" :max="99" :hidden="postfind2_data.num===0">
              <i class="iconfont icon-msg" style="font-size:20px;"></i>
            </el-badge>
            <span v-if="postfind2_data.num===0">
              <i style="padding-right: 14px;color: #FF9200;font-size: 16px;" class="iconfont icon-xiaolian1"></i>当前时间区间内参数正常
            </span>
            <tb v-else tableTitle="tb_006" :tableData="postfind2_data.tableData" v-loading="false"></tb>
          </el-popover>
        </Mtitle>
        <div style="width:100%;display:flex" v-no-data="scroll_data[1].no_data">
          <ecline style="flex:1" width height="400px" unit :visualMap="0.9" :linedata="line" :ecdata="postfind2_data.ec_data"></ecline>
          <div class="right-menu" style="min-width:210px;">
            <p>当前实时功率因数
              <br>
              {{lastValue}}
            </p>
            <p>
              平均功率因数
              <br>
              <span v-if="avgValue&&avgValue!=null&&avgValue<0.9">
                <span class="clo_red">{{avgValue}} &nbsp;</span>进入惩罚区间
              </span>
              <span v-if="avgValue>=0.9">
                <span class="clo_green">{{avgValue}}&nbsp;</span>进入奖励区
              </span>
            </p>
            <p>
              当前时间段内最小功率因数
              <br>
              <span class="clo_red" v-if="minValue&&minValue!=null&&minValue<0.9">{{minValue}}</span>
              <span class="clo_green" v-if="minValue>=0.9">{{minValue}}</span>
            </p>
            <p>发生时间
              <br>
              {{time}}
            </p>
          </div>
        </div>
      </el-col>
    </el-row>
    <el-row class="card ectop">
      <el-col v-loading="scroll_data[2].loading">
        <Mtitle title="三相电压变化曲线">
          <el-popover placement="right-start" width trigger="click" @show="show(3,'')" @hide="hide(3,'')">
            <el-badge slot="reference" style="color:#007ef4" :value="postfind3_data.num" :max="99" :hidden="postfind3_data.num===0">
              <i class="iconfont icon-msg" style="font-size:20px;"></i>
            </el-badge>
            <span v-if="postfind3_data.num===0">
              <i style="padding-right: 14px;color: #FF9200;font-size: 16px;" class="iconfont icon-xiaolian1"></i>当前时间区间内参数正常
            </span>
            <tb v-else tableTitle="tb_006" :tableData="postfind3_data.tableData" v-loading="false"></tb>
          </el-popover>
        </Mtitle>
        <ecline width="100%" v-no-data="scroll_data[2].no_data" height="400px" unit="V" :ecdata="postfind3_data.ec_data"></ecline>
      </el-col>
    </el-row>
    <el-row class="card ectop">
      <el-col v-loading="scroll_data[3].loading">
        <Mtitle title="三相电流变化曲线">
          <el-popover placement="right-start" width trigger="click" @show="show(4,'')" @hide="hide(4,'')">
            <el-badge slot="reference" style="color:#007ef4" :value="postfind4_data.num" :max="99" :hidden="postfind4_data.num===0">
              <i class="iconfont icon-msg" style="font-size:20px;"></i>
            </el-badge>
            <span v-if="postfind4_data.num===0">
              <i style="padding-right: 14px;color: #FF9200;font-size: 16px;" class="iconfont icon-xiaolian1"></i>当前时间区间内参数正常
            </span>
            <tb v-else tableTitle="tb_006" :tableData="postfind4_data.tableData" v-loading="false"></tb>
          </el-popover>
        </Mtitle>
        <ecline width="100%" v-no-data="scroll_data[3].no_data" height="400px" unit="A" :ecdata="postfind4_data.ec_data"></ecline>
      </el-col>
    </el-row>
    <el-row class="card ectop">
      <el-col v-loading="scroll_data[4].loading">
        <Mtitle title="电压不平衡度">
          <el-popover placement="right-start" width trigger="click" @show="show(5,'01')" @hide="hide(5,'01')">
            <el-badge slot="reference" style="color:#007ef4" :value="postfind5_data.num" :max="99" :hidden="postfind5_data.num===0">
              <i class="iconfont icon-msg" style="font-size:20px;"></i>
            </el-badge>
            <span v-if="postfind5_data.num===0">
              <i style="padding-right: 14px;color: #FF9200;font-size: 16px;" class="iconfont icon-xiaolian1"></i>当前时间区间内参数正常
            </span>
            <tb v-else tableTitle="tb_006" :tableData="postfind5_data.tableData" v-loading="false"></tb>
          </el-popover>
        </Mtitle>
        <ecline width="100%" v-no-data="scroll_data[4].no_data" height="400px" unit="%" :ecdata="postfind5_data.ec_data"></ecline>
      </el-col>
    </el-row>
    <el-row class="card ectop">
      <el-col v-loading="scroll_data[5].loading">
        <Mtitle title="电流不平衡度">
          <el-popover placement="right-start" width trigger="click" @show="show(6,'02')" @hide="hide(6,'02')">
            <el-badge slot="reference" style="color:#007ef4" :value="postfind6_data.num" :max="99" :hidden="postfind6_data.num===0">
              <i class="iconfont icon-msg" style="font-size:20px;"></i>
            </el-badge>
            <span v-if="postfind6_data.num===0">
              <i style="padding-right: 14px;color: #FF9200;font-size: 16px;" class="iconfont icon-xiaolian1"></i>当前时间区间内参数正常
            </span>
            <tb v-else tableTitle="tb_006" :tableData="postfind6_data.tableData" v-loading="false"></tb>
          </el-popover>
        </Mtitle>
        <ecline width="100%" v-no-data="scroll_data[5].no_data" height="400px" unit="%" :ecdata="postfind6_data.ec_data"></ecline>
      </el-col>
    </el-row>
    <el-row class="card ectop">
      <el-col v-loading="scroll_data[6].loading">
        <Mtitle title="三相电压谐波畸变率">
          <el-popover placement="right-start" width trigger="click" @show="show(7,'03')" @hide="hide(7,'03')">
            <el-badge slot="reference" style="color:#007ef4" :value="postfind7_data.num" :max="99" :hidden="postfind7_data.num===0">
              <i class="iconfont icon-msg" style="font-size:20px;"></i>
            </el-badge>
            <span v-if="postfind7_data.num===0">
              <i style="padding-right: 14px;color: #FF9200;font-size: 16px;" class="iconfont icon-xiaolian1"></i>当前时间区间内参数正常
            </span>
            <tb v-else tableTitle="tb_006" :tableData="postfind7_data.tableData" v-loading="false"></tb>
          </el-popover>
        </Mtitle>
        <ecline width="100%" v-no-data="scroll_data[6].no_data" height="400px" unit="%" :ecdata="postfind7_data.ec_data"></ecline>
      </el-col>
    </el-row>
    <el-row class="card ectop">
      <el-col v-loading="scroll_data[7].loading">
        <Mtitle title="三相电流谐波畸变率">
          <el-popover placement="right-start" width trigger="click" @show="show(8,'04')" @hide="hide(8,'04')">
            <el-badge slot="reference" style="color:#007ef4" :value="postfind8_data.num" :max="99" :hidden="postfind8_data.num===0">
              <i class="iconfont icon-msg" style="font-size:20px;"></i>
            </el-badge>
            <span v-if="postfind8_data.num===0">
              <i style="padding-right: 14px;color: #FF9200;font-size: 16px;" class="iconfont icon-xiaolian1"></i>当前时间区间内参数正常
            </span>
            <tb v-else tableTitle="tb_006" :tableData="postfind8_data.tableData" v-loading="false"></tb>
          </el-popover>
        </Mtitle>
        <ecline width="100%" v-no-data="scroll_data[7].no_data" height="400px" unit="%" :ecdata="postfind8_data.ec_data"></ecline>
      </el-col>
    </el-row>
    <scroll :scrollData="scroll_data"></scroll>
  </div>
</template>
<script>
import day from "@/utils/day.js";
import dayjs from 'dayjs'
import Mtitle from '@/components/Mtitle'
import tb from '@/components/table'
import ecline from '@/components/echarts/ec_line'
import scroll from '@/components/scroll'
export default {
  name: 'qualityEnergy',
  components: {
    Mtitle,
    ecline,
    tb,
    scroll
  },
  watch: {
  },
  computed: {
  },
  data() {
    return {
      imgurl: [],
      line: [
        { yAxis: 0.85 },
        { yAxis: 0.9 }
      ],
      //功率因数变化曲线右侧数据
      avgValue: "",
      lastValue: '',
      minValue: "",
      time: "",
      postfind1_data: {
        tableData: [],
        ec_data: [],
        num: 0,
      },
      postfind2_data: {
        tableData: [],
        ec_data: [],
        num: 0,
      },
      postfind3_data: {
        ec_data: [],
        tableData: [],
        num: 0
      },
      postfind3_data: {
        tableData: [],
        ec_data: [],
        num: 0
      },
      postfind4_data: {
        tableData: [],
        ec_data: [],
        num: 0
      },
      postfind5_data: {
        tableData: [],
        ec_data: [],
        num: 0
      },
      postfind6_data: {
        tableData: [],
        ec_data: [],
        num: 0
      },
      postfind7_data: {
        tableData: [],
        ec_data: [],
        num: 0
      },
      postfind8_data: {
        tableData: [],
        ec_data: [],
        num: 0
      },
      value_time2: '',
      value_time: '',
      options_time2: [],
      options_time: [],
      // ============初始开始时间==================
      s_time: "",
      // ============初始结束时间==================
      e_time: "",
      // ============初始日期格式==================
      v_type: "yyyy-MM-dd HH:mm",
      // ============初始显示类型==================
      d_type: "datetime",
      // ============日月年默认为日=================
      t_value: 1,
      // ============时间维度下拉框==================
      options_t_type: [
        {
          value: 1,
          label: "日"
        }
      ],
      // ============显示选择日期==================
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        }
      },
      // ==============================
      scroll_data: [ //右侧导航信息，value 为 警告信息条数，为0不显示
        {
          name: '功率</br>变化曲线',
          top: [0, 254],
          value: 0,
          num: 0,
          loading: true,
          no_data: false
        },
        {
          name: '功率因数</br>变化曲线',
          top: [454, 861],
          value: 0,
          num: 0,
          loading: true,
          no_data: false
        },
        {
          name: '三相电压</br>变化曲线',
          top: [861, 1268],
          value: 0,
          num: 0,
          loading: true,
          no_data: false

        },
        {
          name: '三相电流</br>变化曲线',
          top: [1268, 1675],
          value: 0,
          num: 0,
          loading: true,
          no_data: false
        },
        {
          name: '电压</br>不平衡度',
          top: [1675, 2082],
          value: 0,
          num: 0,
          loading: true,
          no_data: false
        },
        {
          name: '电流</br>不平衡度',
          top: [2082, 2489],
          value: 0,
          num: 0,
          loading: true,
          no_data: false
        },
        {
          name: '三相电压</br>谐波畸变率',
          top: [2489, 2796],
          value: 0,
          num: 0,
          loading: true,
          no_data: false

        },
        {
          name: '三相电流</br>谐波畸变率',
          top: [2796, 3303],
          value: 0,
          num: 0,
          loading: true,
          no_data: false
        },
      ],
    };
  },
  mounted() {
    this.$nextTick(() => {
      const ectop = document.getElementsByClassName('ectop')
      for (let i = 0; i < ectop.length; i++) {
        const num = 0
        if (i < ectop.length - 1) {
          num = 1
        } else {
          num = 0
        }
        this.scroll_data[i].top[0] = ectop[i].offsetTop + 50
        this.scroll_data[i].top[1] = ectop[i + num].offsetTop + 50 + (num === 0 ? 100 : 0)
      }
    })

    // console.log(this.scroll_data)
  },
  created() {
    // 初始化默认时间
    // this.s_e = day.init_value(this.d_type)
    this.s_time = dayjs().subtract(6, 'hours').format('YYYY-MM-DD HH:mm')
    this.e_time = dayjs().format('YYYY-MM-DD HH:mm');
    // 获取车间下拉列表
    this.export_s_time = this.s_time;
    this.export_e_time = this.e_time;
    this.export_value = this.t_value;
    this.postfindRooms().then((data) => {
      return this.postfindMeters(data)
    }).then((data) => {
      return this.postfind(data)
    })
    //==========获取默认日期==========
  },
  methods: {
    imgurl_click() {
      const viewer = this.$el.querySelector('.images').$viewer
      viewer.show()
    },
    hide(a, b) {
      var p = this['postfind' + a + '_data']
      p.num = 0
      this.scroll_data[a - 1].num = 0
    },
    show(a, b) {
      var p = this['postfind' + a + '_data']
      // this.gridData[a].no0show = !this.gridData[a].no0show
      if (p.num !== 0) {
        this.$axios.post(this.Eelec + '/indicatorMonitor/getAlarmInfo', {
          "endTime": this.e_time,
          "meterId": this.value_time2,
          "metricType": b,
          "startTime": this.s_time
        }).then(res => {
          if (res.data.code === 200) {
            // this.gridData[a].no0data = res.data.data
            if (res.data.data.length) {
              p.tableData = res.data.data
            }
          }
        }).catch(err => {
          console.log(err)
        })
      }
    },
    //请求所有echart图的数据
    postfind(data) {
      this.postfind1(data)
      this.postfind2(data)
      this.postfind3(data)
      this.postfind4(data)
      this.postfind5(data)
      this.postfind6(data)
      this.postfind7(data)
      this.postfind8(data)
      this.selectImgUrl(data)
    },
    //图片url
    selectImgUrl(data) {
      this.imgurl = []
      this.$axios.post(this.Eelec + '/web/upload/selectImgUrl', {

        "distributeRoomId": this.value_time,

      }).then(res => {

        this.imgurl.push(res.data.data)
      }).catch(err => {
        console.log(err)
      })
    },
    clicklistOne(v) { },
    clicklistTwo(v) { },
    //请求第一个下拉框数据
    postfindRooms() {
      let prodata = new Promise((resolve, reject) => {
        this.$axios.post(this.Eelec + '/indicatorMonitor/findRooms', {
          'custID': sessionStorage.getItem('custId')
        }).then(res => {
          if (res.data.code == 200) {
            this.options_time = res.data.data
            this.value_time = res.data.data[0].id
            resolve(res.data.data[0].id)
          }
        }).catch(err => {
          console.log(err)
        })
      })
      return prodata
    },
    //请求第二个下拉框数据
    postfindMeters(data) {
      let prodata2 = new Promise((resolve, reject) => {
        this.$axios.post(this.Eelec + '/indicatorMonitor/findMeters', {
          "distributeRoomId": data
        }).then(res => {
          if (res.data.code == 200) {
            this.value_time2 = ''
            this.options_time2 = res.data.data
            this.value_time2 = res.data.data[0].meterId
            resolve(res.data.data[0].meterId)
          }
        }).catch(err => {
          console.log(err)
        })

      })
      return prodata2
    },
    // 功率变化曲线
    postfind1(data) {
      this.$axios.post(this.Eelec + '/indicatorMonitor/findActivePower', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[0].loading = false
        if (res.data.code === 200) {
          if (res.data.data.length) {
            this.scroll_data[0].no_data = false
            if (res.data.data[0].metricData) {
              this.postfind1_data.ec_data.push({
                name: res.data.data[0].metricName,
                value: res.data.data[0].metricData
              })
              this.postfind1_data.num += res.data.data[0].num
              this.scroll_data[0].num += res.data.data[0].num
            } else {
              this.scroll_data[0].no_data = true
            }
          }
        } else {
          this.scroll_data[0].no_data = true
        }
      }).catch(err => {
        console.log(err)
      })
      this.$axios.post(this.Eelec + '/indicatorMonitor/findReactivePower', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[0].loading = false
        if (res.data.code === 200) {
          if (res.data.data.length) {
            if (res.data.data[0].metricData) {
              this.scroll_data[0].no_data = false
              this.postfind1_data.ec_data.push({
                name: res.data.data[0].metricName,
                value: res.data.data[0].metricData
              })
              this.postfind1_data.num += res.data.data[0].num
              this.scroll_data[0].num += res.data.data[0].num
            }
          } else {
            this.scroll_data[0].no_data = true
          }
        } else {
          this.scroll_data[0].no_data = true
        }


      }).catch(err => {
        console.log(err)
      })
    },
    //功率因数变化曲线
    postfind2(data) {
      this.$axios.post(this.Eelec + '/indicatorMonitor/findPowerFactor', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[1].loading = false
        if (res.data.code === 200) {
          if (res.data.data.dataResp.length) {
            this.scroll_data[1].no_data = false
            this.postfind2_data.ec_data.push({
              name: res.data.data.dataResp[0].metricName,
              value: res.data.data.dataResp[0].metricData
            })
            this.postfind2_data.num += res.data.data.dataResp[0].num
            this.scroll_data[1].num += res.data.data.dataResp[0].num
            this.avgValue = res.data.data.avgValue
            this.lastValue = res.data.data.lastValue
            this.minValue = res.data.data.minValue
            this.time = res.data.data.time
          } else {
            this.scroll_data[1].no_data = true
            this.postfind2_data.ec_data = []
            this.scroll_data[1].num = []
            this.postfind2_data.num = 0
            this.avgValue = ''
            this.lastValue = ''
            this.minValue = ''
            this.time = ''
          }
        } else {
          this.scroll_data[1].no_data = true
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //	三相电压查询
    postfind3(data) {
      this.$axios.post(this.Eelec + '/indicatorMonitor/findLineVoltage', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[2].loading = false
        if (res.data.code === 200) {
          if (res.data.data.length) {
            this.scroll_data[2].no_data = false
            res.data.data.map((item, index) => {
              this.postfind3_data.ec_data.push({
                name: item.metricName,
                value: item.metricData
              })
              this.postfind3_data.num += item.num
              this.scroll_data[2].num += item.num
            })
          } else {
            this.scroll_data[2].no_data = true
            this.postfind3_data.ec_data = []
            this.scroll_data[2].num = []
            this.postfind3_data.num = 0
          }
        } else {
          this.scroll_data[2].no_data = true
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //	三相电流查询
    postfind4(data) {
      this.$axios.post(this.Eelec + '/indicatorMonitor/findCurrent', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[3].loading = false
        if (res.data.code === 200) {
          if (res.data.data.length) {
            this.scroll_data[3].no_data = false
            res.data.data.map((item, index) => {
              this.postfind4_data.ec_data.push({
                name: item.metricName,
                value: item.metricData
              })
              this.postfind4_data.num += item.num
              this.scroll_data[3].num += item.num
            })
          } else {
            this.scroll_data[3].no_data = true
            this.postfind4_data.ec_data = []
            this.scroll_data[3].num = []
            this.postfind4_data.num = 0
          }
        } else {
          this.scroll_data[3].no_data = true
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //	电压不平衡度
    postfind5(data) {
      this.$axios.post(this.Eelec + '/indicatorMonitor/findVolUnbalance', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[4].loading = false
        if (res.data.code === 200) {
          if (res.data.data.length) {
            this.scroll_data[4].no_data = false
            res.data.data.map((item, index) => {
              this.postfind5_data.ec_data.push({
                name: item.metricName,
                value: item.metricData
              })
              this.postfind5_data.num += item.num
              this.scroll_data[4].num += item.num
            })
          } else {
            this.scroll_data[4].no_data = true
            this.postfind5_data.ec_data = []
            this.scroll_data[4].num = []
            this.postfind5_data.num = 0
          }
        } else {
          this.scroll_data[4].no_data = true
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //	电流不平衡度
    postfind6(data) {
      this.$axios.post(this.Eelec + '/indicatorMonitor/findCurUnbalance', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[5].loading = false
        if (res.data.code === 200) {
          if (res.data.data.length) {
            this.scroll_data[5].no_data = false
            res.data.data.map((item, index) => {
              this.postfind6_data.ec_data.push({
                name: item.metricName,
                value: item.metricData
              })
              this.postfind6_data.num += item.num
              this.scroll_data[5].num += item.num

            })
          } else {
            this.scroll_data[5].no_data = true
            this.postfind6_data.ec_data = []
            this.scroll_data[5].num = []
            this.postfind6_data.num = 0
          }
        } else {
          this.scroll_data[5].no_data = true
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //	三相电压谐波畸变率
    postfind7(data) {
      this.$axios.post(this.Eelec + '/indicatorMonitor/findVolAberrRate', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[6].loading = false
        if (res.data.code === 200) {
          if (res.data.data.length) {
            this.scroll_data[6].no_data = false
            res.data.data.map((item, index) => {
              this.postfind7_data.ec_data.push({
                name: item.metricName,
                value: item.metricData
              })
              this.postfind7_data.num += item.num
              this.scroll_data[6].num += item.num
            })
          } else {
            this.scroll_data[6].no_data = true
            this.postfind7_data.ec_data = []
            this.scroll_data[6].num = []
            this.postfind7_data.num = 0
          }
        } else {
          this.scroll_data[6].no_data = true
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //	三相电流谐波畸变率
    postfind8(data) {
      this.$axios.post(this.Eelec + '/indicatorMonitor/findCurAberrRate', {
        "endTime": this.e_time,
        "meterId": data,
        "startTime": this.s_time
      }).then(res => {
        this.scroll_data[7].loading = false
        if (res.data.code === 200) {
          if (res.data.data.length) {
            this.scroll_data[7].no_data = false
            res.data.data.map((item, index) => {
              this.postfind8_data.ec_data.push({
                name: item.metricName,
                value: item.metricData
              })
              this.postfind8_data.num += item.num
              this.scroll_data[7].num += item.num
            })
          } else {
            this.scroll_data[7].no_data = true
            this.postfind8_data.ec_data = []
            this.scroll_data[7].num = []
            this.postfind8_data.num = 0
          }
        } else {
          this.scroll_data[7].no_data = true
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //==========点击查询==========
    t_button() {
      day.s_e(this.s_time, this.e_time, this.t_value)
        .then(() => {
          this.scroll_data.forEach((item, index) => {
            item.num = 0,
              item.loading = true
          })
          this.postfind1_data.ec_data = []
          this.postfind1_data.num = 0
          this.postfind2_data.ec_data = []
          this.postfind2_data.num = 0
          this.postfind3_data.ec_data = []
          this.postfind3_data.num = 0
          this.postfind4_data.ec_data = []
          this.postfind4_data.num = 0
          this.postfind5_data.ec_data = []
          this.postfind5_data.num = 0
          this.postfind6_data.ec_data = []
          this.postfind6_data.num = 0
          this.postfind7_data.ec_data = []
          this.postfind7_data.num = 0
          this.postfind8_data.ec_data = []
          this.postfind8_data.num = 0
          // this.scroll_data.foreach((item,index)=>{
          //   item.num = 0
          // })
          // this.table_3_data_loading = true
          // this.table_1_data_loading = true
          // this.table_2_data_loading = true
          // this.EC2_data_loading = true
          // this.EC4_data_loading = true
          // this.EC1_data_loading = true
          // this.EC4_data_loading = true
          // this.initdata()
          const data = this.value_time2
          this.postfind(data)
        })
        .catch(() => { });
    },
    //==========切换年月日==========
    t_change(n) {
      this.v_type = day.change_type(n).v;
      this.d_type = day.change_type(n).d;
      this.s_e = day.init_value(this.d_type)
      this.s_time = this.s_e.s;
      this.e_time = this.s_e.e;
    }
  }
};
</script>
 <style scoped lang='scss'>
.qualityEnergy {
  .module_title {
    .icon-msg {
      height: 62px;
      line-height: 62px;
      display: inline-block;
    }
  }
  position: relative;
  padding-right: 100px;
  .right-menu {
    margin-left: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-left: 1px solid #e5e5e5;
    box-sizing: border-box;
    padding: 20px;
    p {
      line-height: 20px;
      color: #666666;
      font-size: 14px;
      margin-bottom: 30px;
      br {
        margin-top: 20px;
      }
      .clo_red {
        color: #ec0240;
      }
      .clo_green {
        color: #44d428;
      }
    }
  }
}
</style>
